<template>

  <card-component
    :content-title="contentTitle"
    :page="page"
    @handleSizeChange="handleSizeChange"
    @handleCurrentChange="handleCurrentChange">

    <div slot="action">
      <el-button type="primary" size="small" style="margin: 10px" @click="handleAddScanner">新增</el-button>
    </div>

    <table-component slot="table"
                     :table-header="tableHeader"
                     :table-data="tableData"
                     :page="page"
                     @handleEdit="handleEdit"
                     @handleDelete="handleDelete"
                     @handleSelectionChange="handleSelectionChange"></table-component>

    <remark-dialog
      slot="dialog"
      :dialogVisible="dialogInfo.visible"
      :formData="dialogInfo.formData"
      :rowIndex="dialogInfo.rowIndex"
      :isNew="dialogInfo.isNew"
      :lineList="lineList"
      @cancelDialog="handleCancelDialog"
      @confrimDialog="handleConfrimDialog"
    ></remark-dialog>

  </card-component>

</template>

<script>

  import card from '@/base/card.vue'
  import table from '@/base/AutoWidthTable.vue'
  import action from '@/base/action.vue'
  import request from '@/common/js/request'
  import remarkDialog from '@/base/lastReflowTempDialog.vue'

  import util from '@/common/js/util'

  export default {
    data() {
      return {
        contentTitle: this.$getTextByLangKey("炉温管理"),
        tableHeader: [],
        tableData: [],
        page: {
          currentPage: 1,
          total: 0,
          pageSize: 20,
        },

        dialogInfo:{
          visible:false,
          formData:{
            sp0:'',
            sp1:'',
            sp2:'',
            sp3:'',
            sp4:'',
            sp5:'',
            sp6:'',
            sp7:'',
            sp8:'',
            sp9:'',
            sp10:'',
            sp11:'',
            sp12:'',
            sp13:'',
            sp14:'',
            sp15:'',
            sp16:'',
            sp17:'',
            sp18:'',
            sp19:'',},
          rowIndex: null,
          isNew:true,//是否新增
        },
        lineList:[]
      }
    },
    created: function () {

      this.fetchPcbaScannerList()
      this.fetchMachineTypeList()
    },

    destroyed: function () {

    },

    watch: {

    },

    methods: {
      fetchPcbaScannerList(){
        request.requestGetReflowTempList({},res=>{
          if(res.data.code === 200){
            const data = res.data.data
            this.tableHeader = this.makeHeader(data.header)
            this.tableData = this.makeList(data.reflowTempDesign)
          }
        })
      },

      fetchMachineTypeList(){
        request.requestLineList(res=>{
          this.lineList = res.data.data
        })

      },


      fetchAddPcbaScanner(info,callback){
        request.requestCreateOrUpdateReflowTemp(info,res=>{
          if(res.data.code === 200){
            util.showSuccessToast(this.$getTextByLangKey('添加成功'))
            this.fetchPcbaScannerList()
            callback&&callback()
          }
        })
      },



      fetchDeletePcbaScanner(id,callback){
        request.requestDeleteReflowTempDesign({id},res=>{
          if(res.data.code === 200){
            util.showSuccessToast(this.$getTextByLangKey('删除成功'))
            this.fetchPcbaScannerList()
            callback&&callback()
          }
        })
      },
      fetchUpdatePcbaScanner(info,callback){
        request.requestCreateOrUpdateReflowTemp(info,res=>{
          if(res.data.code === 200){
            util.showSuccessToast(this.$getTextByLangKey('修改成功'))
            this.fetchPcbaScannerList()
            callback&&callback()
          }
        })
      },


      fetchData: function () {
      },

      makeHeader(headers){
        let actionItem = {type: "action", label: this.$getTextByLangKey('操作'), isShow: true,width:'200px'}

        const newHeaders = headers?headers.map(x=>{
          x.isShow = true
          return x
        }):[]

        newHeaders.push(actionItem)
        return newHeaders
      },

      makeList(list){
        const newList = list?list.map(x=>{
          x.updateTime = new Date(x.updateTime).format("yyyy/MM/dd hh:mm")
          x.action = 'edit,delete'
          return x
        }):[]
        return newList
      },

      handleAddScanner(){
        this.dialogInfo.visible = true
        this.dialogInfo.formData = {
          sp0:'',
          sp1:'',
          sp2:'',
          sp3:'',
          sp4:'',
          sp5:'',
          sp6:'',
          sp7:'',
          sp8:'',
          sp9:'',
          sp10:'',
          sp11:'',
          sp12:'',
          sp13:'',
          sp14:'',
          sp15:'',
          sp16:'',
          sp17:'',
          sp18:'',
          sp19:'',
        }
        this.dialogInfo.isNew = true
      },

      handleCancelDialog(){
        this.dialogInfo.visible = false
      },
      handleConfrimDialog(form,index){

        if(this.dialogInfo.isNew){
          this.fetchAddPcbaScanner(form,()=>{
              this.dialogInfo.visible = false
          })
        }else{
          const {id,lineName,
            sp0,
            sp1,
            sp2,
            sp3,
            sp4,
            sp5,
            sp6,
            sp7,
            sp8,
            sp9,
            sp10,
            sp11,
            sp12,
            sp13,
            sp14,
            sp15,
            sp16,
            sp17,
            sp18,
            sp19,
          } = form

          this.fetchUpdatePcbaScanner({lineName,
            sp0,
            sp1,
            sp2,
            sp3,
            sp4,
            sp5,
            sp6,
            sp7,
            sp8,
            sp9,
            sp10,
            sp11,
            sp12,
            sp13,
            sp14,
            sp15,
            sp16,
            sp17,
            sp18,
            sp19,},()=>{
            this.dialogInfo.visible = false
          })
       }
      },

      handleEdit(index, row) {
        console.log('handleEdit',row)
        this.dialogInfo.formData = util.deepCopy(row)
        this.dialogInfo.rowIndex = index
        this.dialogInfo.visible = true
        this.dialogInfo.isNew = false
        console.log('row',row)
      },
      handleDelete(index, row){

        this.$confirm(`确认删除${row.lineName}炉温记录？`, '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        }).then(() => {
          this.fetchDeletePcbaScanner(row.id)
        }).catch(() => {

        });
      },


      handleSizeChange: function (val) {
        console.log('size ',val)
        this.$emit("handleSizeChange", val)
      },
      handleCurrentChange: function (val) {
        this.page.currentPage = val
        this.fetchPcbaScannerList()
      },

      handleSelectionChange(val) {
        if (val.length > 0) {
          this.isShowDeleteButton = true
          this.isShowCancelLightButton = true
        } else {
          this.isShowDeleteButton = false
          this.isShowCancelLightButton = false
        }

      },


    },
    components: {
      'card-component': card,
      'table-component': table,
      'action-componet': action,
      'remark-dialog': remarkDialog,
    },

  }
</script>


<style scoped>
  .el-card {
    box-shadow: 0 0;
    border-radius: 0;
    border: none;
  }
</style>


